import { Swiper, SwiperSlide } from 'swiper/react';
import 'swiper/css';
import {Autoplay} from 'swiper'
import React, { Component } from 'react'

export default class App extends Component{
  onSwiper(swiper) {
    console.log(swiper)
  }
  render(){
    return (
      <Swiper
        modules={[Autoplay]}
        spaceBetween={50}
        slidesPerView={3}
        autoplay
        onSlideChange={() => console.log('slide change')}
        onSwiper={(swiper) =>{
               //重点是将swiper挂载到this上
               this.swiper = swiper 
        }}
      >
        <SwiperSlide>Slide 1</SwiperSlide>
        <SwiperSlide>Slide 2</SwiperSlide>
        <SwiperSlide>Slide 3</SwiperSlide>
        <SwiperSlide>Slide 4</SwiperSlide>
      </Swiper>
    );
  }
};

